<template>
  <div class="storecouponuser-page page-main">
    <search-form :model="searchParams" @search="search">
      <a-form-item label="使用状态：" name="prop">
        <!-- <el-select v-model="tableFromIssue.status" placeholder="请选择使用状态" clearable  class="selWidth" @change="seachList">
                <el-option label="已使用" value="1" />
                <el-option label="未使用" value="0" />
                <el-option label="已过期" value="2" />
              </el-select> -->
      </a-form-item>
      <a-form-item label="使用状态：" name="prop">
        <!-- <el-select v-model="tableFromIssue.uid" class="selWidth" reserve-keyword remote filterable
                         :remote-method="remoteMethod" :loading="loading" placeholder="请输入领取人" clearable @change="seachList">
                <el-option
                  v-for="item in options"
                  :key="item.uid"
                  :label="item.nickname"
                  :value="item.uid">
                </el-option>
              </el-select> -->
      </a-form-item>
      <a-form-item label="优惠劵：" name="name">
        <a-input v-model:value="searchParams.name" placeholder="请输入" />
      </a-form-item>
    </search-form>

    <g-table ref="tableRef" :columns="columns" :api="couponuser" :params="searchParams" />
  </div>
</template>

<script setup lang="tsx">
import { storecouponuserDel, couponuser } from './api';
import type { Istorecouponuser } from './record';

const searchParams = reactive({
  name: ''
})

let visible = $ref(false)

const { tableRef, columns, search } = useTable<Istorecouponuser>([
  { title: '优惠券ID', dataIndex: 'couponId' },
  { title: '优惠券名称', dataIndex: 'name' },
  { title: '领取人', dataIndex: 'nickname' },
  { title: '面值', dataIndex: 'money' },
  { title: '最低消费额', dataIndex: 'minPrice' },
  { title: '开始使用时间', dataIndex: 'startTime' },
  { title: '结束使用时间', dataIndex: 'endTime' },
  { title: '获取方式', dataIndex: 'type' },
  {
    title: '是否可用', dataIndex: 'status',
    customRender: ({ record }) =>
      record.status == 0 ? "可用" : "不可用",
  },
  {
    title: '使用状态', dataIndex: 'status',
    customRender: ({ record }) =>
      record.status ? record.status : "",
  },

])

let activeRow = $ref<Partial<Istorecouponuser>>({})
function add(row: Partial<Istorecouponuser> = {}) {
  activeRow = { ...row }
  visible = true
}

function remove({ id }: Istorecouponuser) {
  storecouponuserDel(id as number).then(() => {
    AntMessage.success('已删除')
    search(false)
  })
}
</script>

<style lang="scss"></style>